import Vue from "vue";
import Vuex from "vuex";
// import VueRouter from "../plugins/index";
// console.log(VueRouter)
// Vue.use 调用插件内部抛出的install 方法
// 将Vue对象传递给插件
// 插件内部通过Vue.component 进行注册
Vue.use(Vuex)

const store = new Vuex.Store({
   state: {
    // 全局状态全局变量 
    name: "韩梅梅",
    age: 16
   },
   // 要修改state里的数据必须通过mutations里的方法
   mutations: {
      changeNameMutation(state,name) {
        state.name = name
      },
      changeAgeMutation(state,age) {
          state.age = age
      }
   },
   // vuex里的计算属性 和state的数据进行关联 state的数据发生改变后
   // 也变
   getters: {
     dbName(state, getters, rootState, rootGetters) {
      return state.name + state.name
     }
   },
   actions: {
    changeAgeAction(ctx, age) {
      console.log("触发action", age )
      ctx.commit("changeAgeMutation",age)
    },
    changeAgeActionAsync(ctx,age) {
      setTimeout(() => {
        ctx.commit("changeAgeMutation",age)
      },1000)
    },
    combineAgeAndName(ctx, payload) {
      console.log(ctx,payload)
      const { name,age } = payload
      ctx.commit("changeAgeMutation",age)
      ctx.commit("changeNameMutation",name)
    }
   }
})

export default store